<?php session_start();

include 'php/conn.php';

$member = $_SESSION['member'];

$result = mysql_query("SELECT * FROM members WHERE username = '". $member ."' limit 1");

if (!$result) {
  echo "An error occured.";
  exit;
}

while($row = mysql_fetch_array($result))
  {
  	$user_id = $row['id'];
  	$username = $row['username'];
	$hometown = $row['hometown'];
	$fighting = $row['fighting_style'];
  }

$beers_drank = mysql_query("SELECT * FROM beers FULL JOIN beers_drank ON beerID = beer_id AND user_id = $user_id");

?><!doctype html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<!--VIEWPORT META-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

<title>Beer Ticks Mobile App Beer List</title>

<!-- CSS stylesheets -->
    <link type="text/css" href="css/master.css" rel="stylesheet"/>
<!--WEBFONTS-->
	<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'/>    
	<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700,300' rel='stylesheet' type='text/css'/>
<!--JAVASCRIPT-->
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
	<script type="text/javascript" src="js/scripts.js"></script>
	
    
</head>

<body>
	<!--SITE WRAPPER-->
	<div id="siteWrapper">
		<!--LIST WRAPPER-->
		<div class="listWrapper">

			<div class="listContainer">

			<!--LIST TYPES-->
				<ul class="list scroller" id="yourList" ><?php 
				while($row = mysql_fetch_array($beers_drank))
				  {?>
				  	<div class="specificBeerRow">
					  <div class="beerName"><?php echo $row['beerName']; ?>
	                  </div>
	                  <div class="specificBeerBottom">
	                  	<div class="listPageRatingWrapper"><script type="text/javascript"> document.write(getStars(<?php echo $row['rating']; ?>));</script></div>
	                    	<div class="listRatingNumbers"> <?php echo $row['rating'];?></div>
	             		</div>           
					</div>      
					  <?php
					  }
					?>
				</ul>

			</div><!--/LIST CONTAINER-->	
			<div class="backBtn"><a href="#"  onClick="history.back();return false"><img src="images/btn_back.png"/></a></div>	
		</div><!--/LIST WRAPPER-->
	</div><!--/SITE WRAPPER-->
    <!--for($i=0; $i< $row['rating']; $i++){}-->
    <script type="text/javascript" src="js/touchscroll.min.js"></script>
	<script>
	$(document).ready(function() {
	var scrollNode = document.querySelector(".scroller"), options = {};
	var scroller = new TouchScroll(scrollNode, options);
	});
	</script>
</body>
</html>
